<%@ page contentType="text/html; charset=utf-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<%@ taglib prefix="primus" tagdir="/WEB-INF/tags" %>
<primus:page title="广告位列表">
    <jsp:attribute name="css">
        <style type="text/css">
            #adv-table .name{
                min-width: 150px;
            }
            #adv-table .operate, #advtable .status{
                min-width: 80px;
            }
        </style>
    </jsp:attribute>
    <jsp:attribute name="script">
        <script type="application/javascript">
            $(".adv-ban-btn").click(function () {

                $("#id-of-adv").val($(this).data("id"));
                $("#name-of-ban-adv").html($(this).data("name"));
                $("#adv-disable-confirm-modal").modal();
            });
            $(".btn-cancel-ban").click(function () {
                $("#adv-disable-confirm-modal").modal("hide");
            });
            $(".btn-confirm-ban").click(function () {
                var advId = $("#id-of-adv").val();
                $.post("advertisement/adv/deleteByAdvId", {
                    "advId": advId
                }, function (result) {
                    if (result) {
                        $.get("advertisement/adv/list");
                    }
                }, "json");
                $("#adv-disable-confirm-modal").modal("hide");
            });
        </script>
    </jsp:attribute>
    <jsp:body>
        <div class="breadcrumbs ace-save-state" id="breadcrumbs">
            <ul class="breadcrumb">
                <li>
                    <i class="ace-icon fa fa-home home-icon"></i>
                    <a href="welcome.do">
                        首页
                    </a>
                </li>
                <li>
                    运用管理
                </li>
                <li class="active">
                    广告位列表
                </li>
            </ul>
        </div>
        <div class="page-content">
            <div class="row">
                <div class="col-xs-12">
                    <!-- PAGE CONTENT BEGINS -->
                    <div class="row">
                        <div class="col-xs-12">
                            <h3 class="header smaller lighter blue">
                                广告位列表 <span class="inline help-block">(查询)</span>
                                <span class="hidden-sm hidden-xs btn-group pull-right">
                                    <a href="advertisement/adv/new" class="btn btn-sm btn-primary"><i class="ace-icon glyphicon glyphicon-plus"></i>
                                        添加
                                    </a>
                                </span>
                            </h3>

                            <table id="adv-table" class="table table-bordered table-hover">
                                <thead>
                                    <tr>
                                        <th class="name">名称</th>
                                        <th class="operate">宽度</th>
                                        <th class="operate">高度</th>
                                        <th>描述</th>
                                        <th>可用于的终端</th>
                                        <th class="status">是否启用</th>
                                        <th class="operate">使用位置</th>
                                        <th class="center operate"></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <c:forEach items="${adPositionVoPage.content}" var="adPosition">
                                        <tr id="tr-${adPosition.id}">
                                            <td><c:out value="${adPosition.name}" /></td>
                                            <td><c:out value="${adPosition.width}" /></td>
                                            <td><c:out value="${adPosition.height}" /></td>
                                            <td><c:out value="${adPosition.description}" /></td>
                                            <td><c:out value="${adPosition.useType}" /></td>
                                            <td><c:out value="${adPosition.invalid}" /></td>
                                            <td><c:out value="${adPosition.adUsePlace}" /></td>
                                            <td>
                                                <div class="hidden-sm hidden-xs btn-group">
                                                    <a href="advertisement/adv/${adPosition.id}"
                                                       class="btn btn-minier btn-info">
                                                        <i class="ace-icon fa fa-pencil bigger-120"></i>
                                                    </a>
                                                    <a data-id="${adPosition.id}"
                                                       data-name='<c:out value="${adPosition.name}"/>'
                                                       class="btn btn-minier btn-danger adv-ban-btn">
                                                        <i class="ace-icon fa fa-ban bigger-120"></i>
                                                    </a>
                                                </div>
                                            </td>
                                        </tr>
                                    </c:forEach>
                                </tbody>
                            </table>
                            <primus:springPagePagination url="advertisement/adv/list" springPage="${adPositionVoPage}" />
                        </div><!-- /.span -->
                    </div><!-- /.row -->
                        <input type="hidden" id="id-of-adv">
                    <div id="adv-disable-confirm-modal" role="dialog" class="modal" tabindex="-1">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-body">
                                    <button type="button" class="bootbox-close-button close"
                                            data-dismiss="modal" aria-hidden="true">×
                                    </button>
                                    <div class="bootbox-body">您确定要删除吗<span
                                            id="name-of-ban-adv"></span> ?
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-cancel-ban btn-default">
                                        取消
                                    </button>
                                    <button type="button" class="btn btn-confirm-ban btn-primary">
                                        确认
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- PAGE CONTENT ENDS -->
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div>
    </jsp:body>
</primus:page>
